<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<ui:composition>
	<a4j:form id="form">
		<h:panelGrid columns="2" columnClasses="top , top">
			<rich:extendedDataTable value="#{addressBean.itemsDataModel}"
				var="item" id="table" width="690px" height="290px"
				sortMode="#{extendedTableBean.sortMode}"
				selectionMode="single"
				tableState="#{addressBean.tableState}"
				selection="#{addressBean.selection}"
				rows="50">
				<rich:column sortable="true" sortBy="#{item.country}" id="col_1"
					filterBy="#{item.country}" filterEvent="onkeyup" width="170px"
					label="Country">
					<f:facet name="header">
						<h:outputText value="#{bundle['entities.address.country']}" id="header_item_1" />
					</f:facet>
					<h:outputText value="#{item.country}" id="item_1" />
				</rich:column>
				<rich:column sortable="true" sortBy="#{item.city}" id="col_2"
					filterBy="#{item.city}" filterEvent="onkeyup" width="170px"
					label="City">
					<f:facet name="header">
						<h:outputText value="#{bundle['entities.address.city']}" id="header_item_2" />
					</f:facet>
					<h:outputText value="#{item.city}" id="item_2" />
				</rich:column>
				<rich:column sortable="true" sortBy="#{item.streetName}" id="col_3"
					filterBy="#{item.streetName}" filterEvent="onkeyup" width="250px"
					label="StreetName">
					<f:facet name="header">
						<h:outputText value="#{bundle['entities.address.streetName']}" id="header_item_3" />
					</f:facet>
					<h:outputText value="#{item.streetName}" id="item_3" />
				</rich:column>
				<rich:column sortable="true" sortBy="#{item.zip}" id="col_4"
					filterBy="#{item.zip}" filterEvent="onkeyup" width="100px"
					label="ZipCode">
					<f:facet name="header">
						<h:outputText value="#{bundle['entities.address.zip']}" id="header_item_4" />
					</f:facet>
					<h:outputText value="#{item.zip}" id="item_4" />
				</rich:column>
				<a4j:support reRender="addressBean_selectiontable"
					id="addressBean_take_selection" action="#{addressBean.takeSelection}"
					event="onselectionchange" />
			</rich:extendedDataTable>
			<h:panelGroup layout="block" style="width:500px">
				<rich:panel>
					<f:facet name="header">
						<h:outputText value="#{bundle['windows.sortSelectionModes.title']}" />
					</f:facet>
					<h:panelGrid columns="2">
						<h:outputText value="#{bundle['windows.sortSelectionModes.sortMode']}" />
						<h:selectOneMenu value="#{addressBean.sortMode}">
							<f:selectItem itemLabel="#{bundle['windows.sortSelectionModes.sortMode.Single']}" itemValue="single" />
							<f:selectItem itemLabel="#{bundle['windows.sortSelectionModes.sortMode.Multi']}" itemValue="multi" />
							<a4j:support event="onchange" ajaxSingle="true" reRender="table"
								id="support_sort_onchange" />
						</h:selectOneMenu>
					</h:panelGrid>
				</rich:panel>
			    <rich:panel>
			        <f:facet name="header">
			            <h:outputText value="#{bundle['windows.entities.address.Actions']}"></h:outputText>
			        </f:facet>
			            <a4j:commandButton action="#{addressBean.removeSelected}" value="#{bundle['entities.removeSelectedRecords']}"  reRender="table,addressBean_selectiontable"/>
			    </rich:panel>
			    <rich:panel>
			        <f:facet name="header">
			            <h:outputText value="#{bundle['windows.entities.address.NewEntity']}"></h:outputText>
			        </f:facet>
			        <h:panelGrid columns="2">
			            <h:outputText value="#{bundle['entities.address.country']}"/>
			            <rich:inplaceInput defaultLabel="click to enter country" value="#{addressBean.address.country}" />
			            <h:outputText value="#{bundle['entities.address.city']}"/>
			            <rich:inplaceInput defaultLabel="click to enter city" value="#{addressBean.address.city}" />
			            <h:outputText value="#{bundle['entities.address.streetName']}"/>
			            <rich:inplaceInput defaultLabel="click to enter street name" value="#{addressBean.address.streetName}" />
			            <h:outputText value="#{bundle['entities.address.zip']}"/>
			            <rich:inplaceInput defaultLabel="click to enter zip code" value="#{addressBean.address.zip}" />
			            <a4j:commandButton action="#{addressBean.createNew}" value="#{bundle['entities.createNewRecord']}" reRender="table,addressBean_selectiontable"/>
			        </h:panelGrid>
				</rich:panel>
			</h:panelGroup>
		</h:panelGrid>

		<rich:panel>
			<f:facet name="header">
				<h:outputText value="#{bundle['windows.currentlySelected.title']}" />
			</f:facet>
			<rich:dataTable value="#{addressBean.selectedItems}" var="sel"
				id="addressBean_selectiontable">
				<rich:column width="200px">
					<h:outputText value="#{sel.country}" />
				</rich:column>
				<rich:column width="200px">
					<h:outputText value="#{sel.city}" />
				</rich:column>
				<rich:column width="200px">
					<h:outputText value="#{sel.streetName}" />
				</rich:column>
				<rich:column width="120px">
					<h:outputText value="#{sel.zip}" />
				</rich:column>
			</rich:dataTable>
		</rich:panel>

	</a4j:form>
</ui:composition>

</html>